import React from 'react';
import BaseScreen from "../BaseScreen";
import styles from "../../css/Help.module.css"
import {Common_problems} from '../../service/TaskService'
import {navigateTo} from '../../utils/LocationUtil'
// import { Infoicon } from "../../const/imgs"
class Help extends BaseScreen{
  constructor(props){
    super(props);
    this.state={
      problems:[]
    }
  }
  componentDidMount(){
    const params = {
      weichat_id:'',
    }
    Common_problems(params)
    .then(res => {
      // if(res.stat === '1'){
      //   this.setState({
      //     problems:res.info
      //   })
        // that.render()
      // }
    })
    .catch(err => {
      //console.log(err);
    });
  }
  render() {
    const problems = this.state.problems.map((item,index)=>{
      return <Problem key={item.id} name={item.name} url={item.url}/>
    })
    return(
      <div> 
        <ul>
          {problems}
        </ul>
      </div>
    )
  }
}
class Problem extends React.Component{
  navigate = () => {
    navigateTo(this.props.url,'_blank')
  }
  render(){
    const {name} = this.props
    return(
      <li 
        className={styles.help_list_item} 
        onClick={this.navigate}
      >
        <div>
          {name}
        </div>
        <div>
          {/* <img src={Infoicon.RIGHT} /> */}
        </div>
      </li>
    )
  }
}
export default Help;